{% extends 'dashboard/base.html' %}
{% load static %}

{% block title %}操作日志 - 后台管理{% endblock %}

{% block content %}
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
    <h1 class="h2">操作日志</h1>
    <div class="btn-toolbar mb-2 mb-md-0">
        <a href="{% url 'dashboard:admin_dashboard' %}" class="btn btn-sm btn-outline-secondary">
            <i class="bi bi-arrow-left"></i> 返回仪表盘
        </a>
    </div>
</div>

<!-- 搜索和筛选 -->
<div class="card shadow mb-4">
    <div class="card-body">
        <form method="get" class="row g-3">
            <div class="col-md-6">
                <input type="text" name="search" class="form-control" placeholder="搜索管理员、描述..." 
                       value="{{ search_query }}">
            </div>
            <div class="col-md-4">
                <select name="action" class="form-select">
                    <option value="">所有操作类型</option>
                    <option value="user_manage" {% if action_filter == 'user_manage' %}selected{% endif %}>用户管理</option>
                    <option value="activity_manage" {% if action_filter == 'activity_manage' %}selected{% endif %}>活动管理</option>
                    <option value="system_manage" {% if action_filter == 'system_manage' %}selected{% endif %}>系统管理</option>
                </select>
            </div>
            <div class="col-md-2">
                <button type="submit" class="btn btn-primary w-100">筛选</button>
            </div>
        </form>
    </div>
</div>

<!-- 日志列表 -->
<div class="card shadow">
    <div class="card-body">
        <div class="table-responsive">
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>管理员</th>
                        <th>操作类型</th>
                        <th>描述</th>
                        <th>IP地址</th>
                        <th>操作时间</th>
                    </tr>
                </thead>
                <tbody>
                    {% for log in logs %}
                    <tr>
                        <td>{{ log.id }}</td>
                        <td>
                            <strong>{{ log.admin.username }}</strong>
                            {% if log.admin.is_staff %}
                            <span class="badge bg-warning">Staff</span>
                            {% endif %}
                        </td>
                        <td>
                            <span class="badge 
                                {% if log.action == 'user_manage' %}bg-primary
                                {% elif log.action == 'activity_manage' %}bg-success
                                {% else %}bg-info{% endif %}">
                                {{ log.get_action_display }}
                            </span>
                        </td>
                        <td>
                            <span title="{{ log.description }}">
                                {{ log.description|truncatechars:50 }}
                            </span>
                        </td>
                        <td>
                            <code>{{ log.ip_address }}</code>
                        </td>
                        <td>{{ log.created_at|date:"Y-m-d H:i:s" }}</td>
                    </tr>
                    {% empty %}
                    <tr>
                        <td colspan="6" class="text-center text-muted py-4">
                            <i class="bi bi-journal-x display-4 d-block mb-2"></i>
                            暂无操作日志
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>

        <!-- 分页 -->
        {% if logs.has_other_pages %}
        <nav aria-label="Page navigation" class="mt-4">
            <ul class="pagination justify-content-center">
                {% if logs.has_previous %}
                <li class="page-item">
                    <a class="page-link" href="?page={{ logs.previous_page_number }}{% if search_query %}&search={{ search_query }}{% endif %}{% if action_filter %}&action={{ action_filter }}{% endif %}">上一页</a>
                </li>
                {% endif %}

                {% for num in logs.paginator.page_range %}
                    {% if logs.number == num %}
                    <li class="page-item active"><span class="page-link">{{ num }}</span></li>
                    {% else %}
                    <li class="page-item">
                        <a class="page-link" href="?page={{ num }}{% if search_query %}&search={{ search_query }}{% endif %}{% if action_filter %}&action={{ action_filter }}{% endif %}">{{ num }}</a>
                    </li>
                    {% endif %}
                {% endfor %}

                {% if logs.has_next %}
                <li class="page-item">
                    <a class="page-link" href="?page={{ logs.next_page_number }}{% if search_query %}&search={{ search_query }}{% endif %}{% if action_filter %}&action={{ action_filter }}{% endif %}">下一页</a>
                </li>
                {% endif %}
            </ul>
        </nav>
        {% endif %}
    </div>
</div>

<!-- 统计信息 -->
<div class="row mt-4">
    <div class="col-md-3">
        <div class="card bg-primary text-white">
            <div class="card-body">
                <div class="d-flex justify-content-between">
                    <div>
                        <h4>{{ total_logs }}</h4>
                        <p class="mb-0">总日志数</p>
                    </div>
                    <div class="align-self-center">
                        <i class="bi bi-journal-text fs-1"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card bg-success text-white">
            <div class="card-body">
                <div class="d-flex justify-content-between">
                    <div>
                        <h4>{{ user_manage_count }}</h4>
                        <p class="mb-0">用户管理</p>
                    </div>
                    <div class="align-self-center">
                        <i class="bi bi-people fs-1"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card bg-info text-white">
            <div class="card-body">
                <div class="d-flex justify-content-between">
                    <div>
                        <h4>{{ activity_manage_count }}</h4>
                        <p class="mb-0">活动管理</p>
                    </div>
                    <div class="align-self-center">
                        <i class="bi bi-calendar-event fs-1"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <div class="card bg-warning text-white">
            <div class="card-body">
                <div class="d-flex justify-content-between">
                    <div>
                        <h4>{{ today_logs }}</h4>
                        <p class="mb-0">今日日志</p>
                    </div>
                    <div class="align-self-center">
                        <i class="bi bi-clock fs-1"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}